import React, { Component, useEffect, useState } from "react";
import { View, Button, Text } from "@tarojs/components";
import { observer, inject } from "mobx-react";
import Taro, { useRouter } from "@tarojs/taro";
import dayjs from "dayjs";

import "./index.scss";
import { NavBar } from "../../../src/components/nav-bar";
import { TaskComment } from "../project-check-task/comment";
import avatar from "../../assets/avatar.png";
import { CheckStatusEnum, IConfirmLog } from "../../../src/interfaces";
import { RootStore } from "../../../src/store/root-store";
import { fetchConfirmLog } from "../../../src/api";
import { getOssUrl } from "../../../src/utils";
import { NoRecord } from "../../../src/components/no-record";
import NoDashBoard from "../../assets/no-dashboard.png";

const Index = () => {
  const router = useRouter();
  const { spaceId = "", listingId = "", confirmId = "" } = router.params || {};
  const [logList, setLogList] = useState<IConfirmLog[]>([]);
  const [loading, setLoading] = useState(false);
  const [firstFetched, setFirstFetched] = useState(false);
  useEffect(() => {
    const init = async () => {
      setLoading(true);
      Taro.showLoading();
      const { code, data, message } = await fetchConfirmLog(
        spaceId,
        listingId,
        confirmId
      );
      Taro.hideLoading();
      setLoading(false);
      setFirstFetched(true);
      setLogList(data);
    };
    init();
    window.scrollTo(0, 0);
  }, []);
  if (loading) return null;
  return (
    <View className="project-check-log">
      <NavBar
        className="nav-bar"
        left={undefined}
        center="确认日志"
        right={undefined}
        fixed
      ></NavBar>
      {logList.map((item) => {
        return (
          <TaskComment
            key={item.id}
            avatar={getOssUrl(item.creator.img || {})}
            name={item.creator.nickName}
            time={dayjs(item.createdAt).format("YYYY/MM/DD HH:mm")}
            confirm={+item.confirmState === 1}
            words={item.content}
          />
        );
      })}
      {logList.length === 0 && firstFetched && (
        <NoRecord img={NoDashBoard} text="暂无日志" />
      )}
    </View>
  );
};

export default Index;
